<template>
  <div class="userVideoUploadManagement">
    <h3>视频管理</h3>
    <div class="tagList">
      <ul>
        <li
          v-for="(item,index) in tagList"
          :key="index"
          :class="[activeIndex==index?'active':'']"
          @click="searchTag(item,index)"
        >{{item.title}}</li>
      </ul>
    </div>
    <div class="search">
      <div class="cond1 cond">
        <el-input placeholder="请输入视频标题" v-model="search1">
          <template slot="prepend">视频标题</template>
        </el-input>
      </div>
      <div class="cond1 cond">
        <el-input placeholder="请输入视频ID" v-model="search2">
          <template slot="prepend">视频ID</template>
        </el-input>
      </div>
      <div class="cond1 cond">
        <el-input placeholder="请输入用户id" v-model="search3">
          <template slot="prepend">用户id</template>
        </el-input>
      </div>
      <div class="cond2 cond">
        <label>付费类型</label>
        <el-select v-model="search9" placeholder="请选择">
          <el-option
            v-for="item in optionsPayType"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>视频类型</label>
        <el-select v-model="search10" placeholder="请选择">
          <el-option
            v-for="item in optionsVideoType"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>审核状态</label>
        <el-select v-model="search4" placeholder="请选择">
          <el-option
            v-for="item in optionsCheck"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>标签状态</label>
        <el-select v-model="search11" placeholder="请选择">
          <el-option
            v-for="item in optionsTagStatus"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>状态</label>
        <el-select v-model="search5" placeholder="请选择">
          <el-option
            v-for="item in optionsShelves"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>首页状态</label>
        <el-select v-model="search8" placeholder="请选择">
          <el-option
            v-for="item in optionsIndexStatus"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>上传时间</label>
        <el-date-picker
          v-model="search6"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
          value-format="yyyy-MM-dd"
        ></el-date-picker>
      </div>
      <div class="cond2 cond">
        <label>视频来源</label>
        <el-select v-model="search7" placeholder="请选择">
          <el-option
            v-for="item in optionsVideoFrom"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div>
        <el-button type="primary" icon="el-icon-search" @click="searchMethod">搜索</el-button>
      </div>
    </div>
    <div class="opration">
      <el-button
        type="success"
        icon="el-icon-plus"
        @click="addData"
        v-if="permissions_obj.id_135||permissions_obj.id_all"
      >添加</el-button>
      <el-button
        type="primary"
        icon="el-icon-plus"
        @click="batchAddIndex"
        v-if="permissions_obj.id_132||permissions_obj.id_all"
      >批量添加首页推荐</el-button>
      <el-button
        type="primary"
        icon="el-icon-plus"
        @click="batchAddIndexFree"
        v-if="permissions_obj.id_132||permissions_obj.id_all"
      >批量添加首页免费</el-button>
      <el-button
        type="success"
        @click="batchUp"
        v-if="permissions_obj.id_139||permissions_obj.id_all"
      >批量上架</el-button>
      <el-button
        type="warning"
        @click="batchDown"
        v-if="permissions_obj.id_140||permissions_obj.id_all"
      >批量下架</el-button>
      <el-button
        type="danger"
        @click="batchDelete"
        v-if="permissions_obj.id_138||permissions_obj.id_all"
      >批量删除</el-button>
    </div>
    <div class="list">
      <el-table
        border
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="45" header-align="center" align="center"></el-table-column>
        <el-table-column type="index" width="50" header-align="center" align="center" label="序号"></el-table-column>
        <el-table-column header-align="center" align="center" label="封面" width="100">
          <template slot-scope="scope">
            <div class="left" style="width: 80px; height: 80px">
              <img
                :src="scope.row.cover"
                alt
                style="max-width: 80px; max-height: 80px"
                @click="imgView(scope.row.cover)"
              />
            </div>
          </template>
        </el-table-column>
        <el-table-column header-align="center" align="center" label="视频信息" >
          <template slot-scope="scope">
            <div class="vedioBox">
              <div class="right">
                <div>
                  ID：
                  <span>{{scope.row.id}}</span>
                </div>
                <div>
                  标题：
                  <span>{{scope.row.title}}</span>
                </div>
                <div>
                  时长：
                  <span>{{scope.row.duration|sec_to_time}}</span>
                </div>

                <div v-if="scope.row.from>0" class="playList">
                  <!-- //浏览器播放 -->
                  <el-button
                    size="mini"
                    type="warning"
                    @click="handleBrowserPlay(scope.$index, scope.row)"
                  >播放正片</el-button>
                  <el-button
                    size="mini"
                    type="warning"
                    @click="handleBrowserPlayPreview(scope.$index, scope.row)"
                  >播放预览</el-button>
                </div>
                <div class="playList" v-else>
                  <el-button
                    size="mini"
                    type="warning"
                    @click="handlePlay(scope.$index, scope.row)"
                  >播放正片</el-button>
                  <el-button
                    size="mini"
                    type="warning"
                    @click="handlePlayPreview(scope.$index, scope.row)"
                  >播放预览</el-button>
                </div>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column header-align="center" align="center" prop="typeList" label="视频分类" width="90"></el-table-column>
        <el-table-column header-align="center" align="center" label="付费类型" width="80">
          <template slot-scope="scope">
            <div>{{scope.row.video_paytype==2?scope.row.coins:""}}{{scope.row.video_paytype_zh}}</div>
          </template>
        </el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="is_long_text"
          label="视频类型"
          width="60"
        ></el-table-column>
         <el-table-column
          header-align="center"
          align="center"
          prop="is_open_text"
          label="播放片头"
          width="60"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="created_at"
          label="上传时间"
          width="95"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="user_nick"
          label="用户名"
          width="65"
        ></el-table-column>
        <el-table-column header-align="center" align="center" prop="uid" label="用户ID" width="80"></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="check_text"
          label="审核状态"
          width="60"
        ></el-table-column>
        <el-table-column header-align="center" align="center" prop="like" label="点赞量" width="70"></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="buy_video_count"
          label="购买量"
          width="70"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="status_text"
          label="状态"
          width="60"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="online_at"
          label="上/下架时间"
          width="95"
        ></el-table-column>
        <el-table-column header-align="center" align="center" label="操作" width="160" fixed="right">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="warning"
              @click="handleReview(scope.$index, scope.row)"
              v-if="scope.row.check==0"
            >审核</el-button>
            <el-button size="mini" type="success" v-if="scope.row.check==1">已审核</el-button>
            <el-button size="mini" type="danger" v-if="scope.row.check==2">审核失败</el-button>
            <el-button
              size="mini"
              type="danger"
              v-if="permissions_obj.id_134||permissions_obj.id_all"
              v-show="scope.row.status==1"
              @click="handleTakeOff(scope.$index, scope.row)"
            >下架</el-button>
            <el-button
              size="mini"
              type="success"
              @click="handleShelves(scope.$index, scope.row)"
              v-if="permissions_obj.id_134||permissions_obj.id_all"
              v-show="scope.row.status==0"
            >上架</el-button>
            <el-button
              size="mini"
              type="danger"
              v-show="!isSticky"
              @click="handleNoSticky(scope.$index, scope.row)"
            >正常</el-button>
            <el-button
              size="mini"
              type="primary"
              @click="handleModify(scope.$index, scope.row)"
              v-if="permissions_obj.id_135||permissions_obj.id_all"
            >修改</el-button>
            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)"
              v-if="permissions_obj.id_126||permissions_obj.id_all"
            >删除</el-button>
            <el-button
              size="mini"
              type="success"
              @click="handleUpIndex(scope.$index, scope.row)"
              v-if="scope.row.recommend_perfect_count==0"
            >添加首页推荐</el-button>
            <el-button size="mini" type="info" v-if="scope.row.recommend_perfect_count>0">已添加首页推荐</el-button>
            <el-button
              size="mini"
              type="success"
              @click="handleUpIndexFree(scope.$index, scope.row)"
              v-if="scope.row.free_perfect_count==0"
            >添加首页免费</el-button>
            <el-button size="mini" type="info" v-if="scope.row.free_perfect_count>0">已添加首页免费</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="page">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage1"
        :page-sizes="[10,30,50,100]"
        :page-size="pageSize"
        layout="total, prev, pager, next,sizes,jumper"
        :total="totalSize"
      ></el-pagination>
    </div>
    <!-- //编辑视频相关信息弹窗 -->
    <el-dialog
      title="视频编辑"
      :visible.sync="modifyEditorDialogVisible"
      width="40%"
      center
      class="dialog"
    >
      <div class="row">
        <span>ID：</span>
        <el-input v-model="inputUserID" :disabled="true"></el-input>
      </div>
      <div class="row">
        <span>标题：</span>
        <el-input placeholder="请输入标题" v-model="inputTitle" clearable type="textarea"></el-input>
      </div>
      <div class="row">
        <span>视频类型：</span>
        <el-select v-model="inputVideoType" placeholder="请选择">
          <el-option
            v-for="item in optionsVideoTypeInput"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row">
        <span>付费类型：</span>
        <el-select v-model="inputPayType" placeholder="请选择">
          <el-option
            v-for="item in optionsPayTypeInput"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row" v-if="inputPayType==2">
        <span>价格：</span>
        <el-input placeholder="请输入钻石价格" v-model="inputDiamondPrice" clearable></el-input>
      </div>
      <div class="row">
        <span>用户：</span>
        <el-input placeholder="请输入用户邀请码" v-model="inputUid" clearable></el-input>
      </div>
      <div class="row" v-if="selectFrom==0">
        <span>视频封面：</span>
        <el-upload
          :action="imgUploadParth"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :limit="1"
          :on-success="imgUploadSuccess"
          :on-error="imgUploadFailure"
          :file-list="fileList"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogVisible">
          <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
      </div>
      <div class="row" v-if="selectFrom==0">
        <span>视频预览：</span>
        <el-upload
          class="upload-demo"
          list-type="picture"
          :action="previewVedioUploadParth"
          :limit="1"
          :on-success="previewUploadSuccess"
          :on-error="previewUploadFailure"
        >
          <el-button size="small" type="primary">点击上传预览视频</el-button>
        </el-upload>
      </div>
      <div class="row">
        <span>视频时长：</span>
        <el-time-picker
          v-model="inputDuration"
          value-format="H:m:s"
          placeholder="选择时长"
          :picker-options="{selectableRange: '00:00:00 - 02:59:59'}"
        ></el-time-picker>
      </div>
      <div class="row">
        <span>播放片头：</span>
        <el-select v-model="inputIsPlay" placeholder="请选择">
          <el-option
            v-for="item in optionsIsPlay"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row">
        <span>类型选择：</span>
        <el-checkbox-group v-model="checkList">
          <el-checkbox :label="item.id" v-for="(item,index) in tagList" :key="index">{{item.title}}</el-checkbox>
        </el-checkbox-group>
      </div>
      <div class="dialogBtn">
        <el-button type="primary" size="small" @click="submitModifyEditor">提交</el-button>
        <el-button type="info" size="small" @click="cancelModifyEditor">取消</el-button>
      </div>
    </el-dialog>
    <!-- //添加视频弹窗 -->
    <el-dialog title="视频添加" :visible.sync="addDialogVisible" width="40%" center class="dialog">
      <div class="row">
        <span>标题：</span>
        <el-input placeholder="请输入标题" v-model="inputTitle" clearable type="textarea"></el-input>
      </div>
      <div class="row">
        <span>视频类型：</span>
        <el-select v-model="inputVideoType" placeholder="请选择">
          <el-option
            v-for="item in optionsVideoTypeInput"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row">
        <span>付费类型：</span>
        <el-select v-model="inputPayType" placeholder="请选择">
          <el-option
            v-for="item in optionsPayTypeInput"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row" v-if="inputPayType==2">
        <span>价格：</span>
        <el-input placeholder="请输入钻石价格" v-model="inputDiamondPrice" clearable></el-input>
      </div>
      <div class="row">
        <span>用户：</span>
        <el-input placeholder="请输入用户邀请码" v-model="inputUid" clearable></el-input>
      </div>
      <div class="row">
        <span>视频封面：</span>
        <el-upload
          :action="imgUploadParth"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :limit="1"
          :on-success="imgUploadSuccess"
          :on-error="imgUploadFailure"
          :file-list="fileList"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogVisible">
          <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
      </div>
      <div class="row">
        <span>视频预览：</span>
        <el-upload
          class="upload-demo"
          list-type="picture"
          :action="previewVedioUploadParth"
          :limit="1"
          :on-success="previewUploadSuccess"
          :on-error="previewUploadFailure"
          :file-list="fileListVideoPreview"
        >
          <el-button size="small" type="primary">点击上传预览视频</el-button>
        </el-upload>
      </div>
      <div class="row">
        <span>视频正片：</span>
        <el-upload
          class="upload-demo"
          list-type="picture"
          :action="vedioUploadParth"
          :limit="1"
          :on-success="uploadSuccess"
          :on-error="uploadFailure"
          :file-list="fileListVideo"
        >
          <el-button size="small" type="primary">点击上传视频正片</el-button>
        </el-upload>
      </div>
      <div class="row">
        <span>视频时长：</span>
        <el-time-picker
          v-model="inputDuration"
          value-format="H:m:s"
          default-value="0"
          placeholder="选择时长"
          :picker-options="{selectableRange: '00:00:00 - 02:59:59'}"
        ></el-time-picker>
      </div>
      <div class="row">
        <span>播放片头：</span>
        <el-select v-model="inputIsPlay" placeholder="请选择">
          <el-option
            v-for="item in optionsIsPlay"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row">
        <span>类型选择：</span>
        <el-checkbox-group v-model="checkList">
          <el-checkbox :label="item.id" v-for="(item,index) in tagList" :key="index">{{item.title}}</el-checkbox>
        </el-checkbox-group>
      </div>
      <div class="dialogBtn">
        <el-button type="primary" size="small" @click="submitModifyEditor">提交</el-button>
        <el-button type="info" size="small" @click="cancelModifyEditor">取消</el-button>
      </div>
    </el-dialog>
    <!-- //播放弹窗 -->
    <el-dialog title="播放" :visible.sync="playDialogVisible" width="40%" center>
      <div>
        <video
          controls
          width="100%"
          height="500"
          :src="playUrl"
        >Sorry, your browser doesn't support embedded videos.</video>
      </div>
    </el-dialog>
    <!-- //图片预览 -->
    <el-dialog :visible.sync="imgDialogVisible">
      <img width="100%" :src="imgPreview" alt />
    </el-dialog>
  </div>
</template>
<script>
//图片进行aes解密
import aes from "../../common/aes";
import md5 from "js-md5";
export default {
  name: "userVideoUploadManagement",
  data() {
    return {
      search1: "",
      search2: "",
      search3: "",
      search4: "",
      search5: "",
      search6: "",
      search7: "",
      search8: "",
      search9: "",
      search10: "",
      search11: "",
      //审核状态
      optionsCheck: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "未审核"
        },
        {
          value: 1,
          label: "审核通过"
        },
        {
          value: 2,
          label: "审核失败"
        }
      ],
      //上架状态
      optionsShelves: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "下架"
        },
        {
          value: 1,
          label: "上架"
        },
        {
          value: 2,
          label: "转码中"
        },
        {
          value: 3,
          label: "转码失败"
        }
      ],
      //首页状态
      optionsIndexStatus: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "未添加"
        },
        {
          value: 1,
          label: "首页推荐"
        },
        {
          value: 2,
          label: "首页免费"
        }
      ],
      //视频来源
      optionsVideoFrom: [],
      //付费类型
      optionsPayType: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 1,
          label: "VIP"
        },
        {
          value: 2,
          label: "钻石"
        },
        {
          value: 3,
          label: "免费"
        }
      ],
      //弹窗付费类型
      optionsPayTypeInput: [
        {
          value: 1,
          label: "VIP"
        },
        {
          value: 2,
          label: "钻石"
        },
        {
          value: 3,
          label: "免费"
        }
      ],
      //视频类型
      optionsVideoType: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "短视频"
        },
        {
          value: 1,
          label: "长视频"
        }
      ],
      //弹窗视频类型
      optionsVideoTypeInput: [
        {
          value: 0,
          label: "短视频"
        },
        {
          value: 1,
          label: "长视频"
        }
      ],
      //标签状态
      optionsTagStatus: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "无标签"
        },
        {
          value: 1,
          label: "有标签"
        }
      ],
      //是否播放片头
      optionsIsPlay:[
         {
          value: 0,
          label: "否"
        },
        {
          value: 1,
          label: "是"
        }
      ],
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      tableData: [],
      tagList: [],
      currentPage1: 1,
      pageSize: 10,
      totalSize: 0,
      //多选框选中的值
      multipleSelection: [],
      //已审核按钮
      isShowReviewed: false,
      //审核失败按钮
      isShowReviewFailure: false,
      //是否下架
      isTakeOff: true,
      //是否置顶
      isSticky: true,
      //修改话题圈
      modifyTopicDialogVisible: false,
      //话题内容
      textareaTopic: "",
      //修改编辑视频相关信息弹窗
      modifyEditorDialogVisible: false,
      //视频编辑用户id
      inputUserID: "",
      //视频编辑弹窗，视频标题
      inputTitle: "",
      //视频编辑弹窗，视频类型
      inputVideoType: "",
      //视频编辑弹窗，付费类型
      inputPayType: "",
      //视频编辑弹窗，钻石价格
      inputDiamondPrice: "",
      //视频编辑弹窗，用户邀请码
      inputUid: "",
      //视频编辑弹窗，时长
      inputDuration: "00:00:00",
      //视频编辑，是否播放片头
      inputIsPlay:"",
      //视频编辑弹窗，旧图片地址
      imgUrl: "",
      //视频编辑弹窗，新图片地址
      dialogImageUrl: "",
      //视频编辑弹窗，图片预览
      dialogVisible: false,
      //视频编辑弹窗，已选择类型
      checkList: [],
      //播放视频弹窗
      playDialogVisible: false,
      //选中标签下标
      activeIndex: null,
      //选中标签id
      selectTagId: "",
      //播放弹窗播放地址
      playUrl: "",
      imgDialogVisible: false,
      imgPreview: "",
      //视频添加
      addDialogVisible: false,
      dialogImageUrl: "",
      dialogVisible: false,
      //图片上传成功返回地址
      uploadImg: "",
      // 视频正片上传成功返回地址
      uploadVedio: "",
      // 视频预览上传成功返回地址
      uploadPreviewVedio: "",
      //视频正片上传接口地址
      vedioUploadParth: "",
      //视频预览上传接口地址
      previewVedioUploadParth: "",
      //图片上传接口地址
      imgUploadParth: "",
      fileList: [],
      fileListVideoPreview: [],
      fileListVideo: [],
      //修改时选择的视频来源
      selectFrom:"",
      // 权限管理
      permissions: [],
      permissions_obj: {}
    };
  },
  created() {
    //权限判断
    this.permissions = this.$store.state.permissions;
    let oneOff = false;
    this.permissions.forEach((item, index) => {
      if (item == -1) {
        oneOff = true;
      } else {
        this.permissions_obj["id_" + item] = item;
      }
    });
    if (oneOff) {
      this.permissions_obj.id_all = true;
    } else {
      this.permissions_obj.id_all = false;
    }
  },
  mounted() {
    this.getFileUploadParth();
    this.getTagList();
    this.getDataList();
  },
  methods: {
    imgView(url) {
      this.imgDialogVisible = true;
      this.imgPreview = url;
    },
    // 分页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.currentPage1 = val;
      this.getDataList();
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getDataList();
    },
    //多选框选中
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    searchMethod() {
      this.currentPage1 = 1;
      this.getDataList();
    },
    //播放视频
    handlePlay(index, row) {
      console.log(row);
      this.playDialogVisible = true;
      this.playUrl = row.mu;
    },
    handlePlayPreview(index, row) {
      this.playDialogVisible = true;
      this.playUrl = row.smu;
    },
    //浏览器播放
    handleBrowserPlay(index, row) {
      window.open(row.mu, "_blank", "width=375,height=667,left=500,top=100");
    },
    handleBrowserPlayPreview(index, row) {

      // window.open('chrome-extension://ckblfoghkjhaclegefojbgllenffajdc/player.html#http://store.ios.kz2.site/a1.php', "_blank", "width=375,height=667,left=500,top=100");
      window.open(row.smu, "_blank", "width=375,height=667,left=500,top=100");
    },
    //审核
    handleReview(index, row) {
      if (!this.permissions_obj.id_133 && !this.permissions_obj.id_all) {
        this.$message({
          type: "info",
          message: "没有权限进行该操作"
        });
        return;
      }
      this.$confirm("审核通过后，视频将自动转码上架?", "提示", {
        confirmButtonText: "通过",
        cancelButtonText: "不通过",
        type: "warning",
        distinguishCancelAndClose: true
      })
        .then(() => {
          this.checkMethod(row.id, 1);
        })
        .catch(action => {
          if (action == "cancel") {
            this.checkMethod(row.id, 2);
          }
        });
    },

    //下架
    handleTakeOff(index, row) {
      this.$confirm("是否下架该视频?", "提示", {
        confirmButtonText: "是",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.statusChengeMethod(row.id, 0);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消下架"
          });
        });
    },
    //上架
    handleShelves(index, row) {
      this.$confirm("是否上架该视频?", "提示", {
        confirmButtonText: "是",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.statusChengeMethod(row.id, 1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消上架"
          });
        });
    },
    //修改
    handleModify(index, row) {
      this.modifyEditorDialogVisible = true;
      this.selectFrom=row.from;
      this.inputUserID = row.id;
      this.inputTitle = row.title;
      this.inputVideoType = row.is_long;
      this.inputPayType = row.video_paytype;
      this.inputDiamondPrice = row.coins;
      this.inputUid = row.uid;
      this.inputDuration = this.$vuefilter.sec_to_time(row.duration);
      this.inputIsPlay=row.is_open;
      this.uploadImg = "";
      this.uploadVedio = "";
      this.uploadPreviewVedio = "";
      this.fileList = [];
      this.fileListVideoPreview = [];
      this.fileListVideo = [];
      let arr = [];
      if (row.category && row.category.length > 0) {
        row.category.forEach((item, index) => {
          arr.push(item.type_id);
        });
        this.checkList = arr;
      } else {
        this.checkList = [];
      }
    },
    //删除
    handleDelete(index, row) {
      this.$confirm("此操作将删除该视频, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.deleteMethod(row.id);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    //图片预览
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    //删除上传图片
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    //提交修改编辑视频
    async submitModifyEditor() {
      if (!this.inputTitle) {
        this.$message({
          message: "请填写视频标题",
          type: "warning"
        });
        return;
      }
      if (!this.inputUserID && !this.uploadImg) {
        this.$message({
          message: "请上传视频封面",
          type: "warning"
        });
        return;
      }
      if (!this.inputUserID && !this.uploadVedio) {
        this.$message({
          message: "请上传视频正片",
          type: "warning"
        });
        return;
      }
      if (!this.inputUserID && !this.uploadPreviewVedio) {
        this.$message({
          message: "请上传预览视频",
          type: "warning"
        });
        return;
      }
      let arr = this.inputDuration.split(":");
      let time = Number(arr[0]) * 3600 + Number(arr[1]) * 60 + Number(arr[2]);
      let parames = {
        handshake: "",
        data: {
          video_id: this.inputUserID,
          title: this.inputTitle,
          is_long: this.inputVideoType,
          is_free: this.inputPayType == 3 ? 1 : 0,
          coins: this.inputPayType != 2?0:this.inputDiamondPrice,
          uid: this.inputUid,
          cover: this.uploadImg,
          smu: this.uploadPreviewVedio,
          mu: this.uploadVedio,
          duration: time,
          is_open:this.inputIsPlay,
          type_ids: this.checkList.join(",")
        }
      };
      let res = await this.$axios.post(
        this.$api.videoSave,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.modifyEditorDialogVisible = false;
        this.addDialogVisible = false;
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //取消修改编辑视频
    cancelModifyEditor() {
      this.modifyEditorDialogVisible = false;
      this.addDialogVisible = false;
    },

    //搜索标签
    searchTag(item, index) {
      this.activeIndex = index;
      this.selectTagId = item.id;
      this.currentPage1 = 1;
      this.getDataList();
    },
    //获取标签列表
    async getTagList() {
      let parames = {
        handshake: "",
        data: {}
      };
      let res = await this.$axios.post(
        this.$api.typeInfo,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.tagList = res.data.type;
        let from = res.data.from;
        from.forEach((item, index) => {
          let obj = {};
          obj.value = index;
          obj.label = item;
          this.optionsVideoFrom.push(obj);
        });
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //获取初始化数据列表
    async getDataList() {
      let parames = {
        handshake: "",
        data: {
          page: this.currentPage1,
          page_size: this.pageSize,
          search: {
            title: this.search1,
            video_id: this.search2,
            user_id: this.search3,
            video_paytype: this.search9,
            is_long: this.search10,
            check: this.search4,
            is_type_video: this.search11,
            status: this.search5,
            stime:
              this.search6 && this.search6.length > 0 ? this.search6[0] : "",
            otime:
              this.search6 && this.search6.length > 1 ? this.search6[1] : "",
            type_id: this.selectTagId,
            from: this.search7,
            is_home: this.search8
          }
        }
      };
      let res = await this.$axios.post(
        this.$api.videoList,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.initData = {};
        this.initData = res.data;
        this.initData.data.forEach((item, index) => {
          //图片进行aes解密
          let _promise = new Promise((resolve, reject) => {
            aes.getDecrypt(item.cover, resolve);
          });
          _promise.then(cover => {
            item.cover = cover;
            let arr = [];
            arr.push(cover);
            item.coverList = arr;
          });
          if (item.check == 0) {
            item.check_text = "未审核";
          } else if (item.check == 1) {
            item.check_text = "审核通过";
          } else if (item.check == 2) {
            item.check_text = "审核未通过";
          }
          if (item.status == 0) {
            item.status_text = "下架";
          } else if (item.status == 1) {
            item.status_text = "上架";
          } else if (item.status == 2) {
            item.status_text = "转码中";
          } else if (item.status == 3) {
            item.status_text = "转码失败";
          }
          if (item.is_long == 0) {
            item.is_long_text = "短视频";
          } else if (item.is_long == 1) {
            item.is_long_text = "长视频";
          }
          if (item.is_open == 0) {
            item.is_open_text = "否";
          } else if (item.is_open == 1) {
            item.is_open_text = "是";
          }
          let typeList = [];
          item.category.forEach((it, ind) => {
            typeList.push(it.title);
          });
          item.typeList = typeList.join(",");
        });
        this.totalSize = this.initData.total;
        this.tableData = this.initData.data;
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //删除接口aa
    async deleteMethod(id) {
      let parames = {
        handshake: "",
        data: {
          id: id
        }
      };
      let res = await this.$axios.post(
        this.$api.videoDelete,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //审核接口
    async checkMethod(id, status) {
      let parames = {
        handshake: "",
        data: {
          video_id: id,
          check: status
        }
      };
      let res = await this.$axios.post(
        this.$api.videoCheck,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //上架下架接口
    async statusChengeMethod(id, status) {
      let parames = {
        handshake: "",
        data: {
          video_id: id,
          status: status
        }
      };
      let res = await this.$axios.post(
        this.$api.videoUpdate,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //图片上传成功
    imgUploadSuccess(response, file, fileList) {
      this.$message({
        message: "上传成功",
        type: "success"
      });
      this.uploadImg = response.result.file_path;
    },
    imgUploadFailure(err, file, fileList) {
      this.$message({
        message: "上传失败",
        type: "warning"
      });
    },
    // 视频正片上传成功
    uploadSuccess(response, file, fileList) {
      this.$message({
        message: "上传成功",
        type: "success"
      });
      this.uploadVedio = response.result.file_path;
    },
    uploadFailure(err, file, fileList) {
      this.$message({
        message: "上传失败",
        type: "warning"
      });
    },
    // 视频预览上传成功
    previewUploadSuccess(response, file, fileList) {
      this.$message({
        message: "上传成功",
        type: "success"
      });
      this.uploadPreviewVedio = response.result.file_path;
    },
    previewUploadFailure(err, file, fileList) {
      this.$message({
        message: "上传失败",
        type: "warning"
      });
    },
    //获取文件上传地址
    async getFileUploadParth() {
      let parames = {
        handshake: "",
        data: {}
      };
      let res = await this.$axios.post(
        this.$api.uploadGet_domain,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        let timestamp = parseInt(new Date().getTime() / 1000);
        let platform = "P";
        let secret = "Z6Kbz8hpT9VtGmcu";
        let sign = md5(platform + timestamp + secret).toUpperCase();
        // console.log(sign);
        this.vedioUploadParth =
          res.data.url +
          "?dir=vd&platform=P&timestamp=" +
          timestamp +
          "&sign=" +
          sign;
        this.previewVedioUploadParth =
          res.data.url +
          "?dir=vd&platform=P&timestamp=" +
          timestamp +
          "&sign=" +
          sign;
        this.imgUploadParth =
          res.data.url +
          "?dir=video_cover&platform=P&timestamp=" +
          timestamp +
          "&sign=" +
          sign;
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    addData() {
      this.inputTitle = "";
      this.inputUserID = "";
      this.inputVideoType = "";
      this.inputPayType = "";
      this.inputDiamondPrice = "";
      this.inputDuration = "";
      this.inputIsPlay = "";
      this.inputUid = "";
      this.checkList = [];
      this.uploadImg = "";
      this.uploadVedio = "";
      this.uploadPreviewVedio = "";
      this.fileList = [];
      this.fileListVideoPreview = [];
      this.fileListVideo = [];
      this.addDialogVisible = true;
    },
    //批量添加首页
    async batchAddIndex() {
      if (!this.multipleSelection || this.multipleSelection.length < 1) {
        this.$message({
          message: "请选择视频",
          type: "warning"
        });
        return;
      }
      let newArr = [];
      this.multipleSelection.forEach((item, index) => {
        newArr.push(item.id);
      });
      let idList = newArr.join(",");
      let parames = {
        handshake: "",
        data: {
          ids: idList
        }
      };
      let res = await this.$axios.post(
        this.$api.videoIndexAdds,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //批量添加首页免费
    async batchAddIndexFree() {
      if (!this.multipleSelection || this.multipleSelection.length < 1) {
        this.$message({
          message: "请选择视频",
          type: "warning"
        });
        return;
      }
      let newArr = [];
      this.multipleSelection.forEach((item, index) => {
        newArr.push(item.id);
      });
      let idList = newArr.join(",");
      let parames = {
        handshake: "",
        data: {
          ids: idList,
          type: 2
        }
      };
      let res = await this.$axios.post(
        this.$api.videoIndexAdds,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //批量上架
    batchUp() {
      if (!this.multipleSelection || this.multipleSelection.length < 1) {
        this.$message({
          message: "请选择视频",
          type: "warning"
        });
        return;
      }
      this.$confirm("此操作将批量上架视频, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.batchUpMethod();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消批量上架"
          });
        });
    },
    //批量下架
    batchDown() {
      if (!this.multipleSelection || this.multipleSelection.length < 1) {
        this.$message({
          message: "请选择视频",
          type: "warning"
        });
        return;
      }
      this.$confirm("此操作将批量下架视频, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.batchDownMethod();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消批量下架"
          });
        });
    },
    //批量删除
    batchDelete() {
      if (!this.multipleSelection || this.multipleSelection.length < 1) {
        this.$message({
          message: "请选择视频",
          type: "warning"
        });
        return;
      }
      this.$confirm("此操作将批量删除视频, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.batchDeleteMethod();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消批量删除"
          });
        });
    },
    //单条添加首页推荐
    handleUpIndex(index, row) {
      if (!this.permissions_obj.id_132 && !this.permissions_obj.id_all) {
        this.$message({
          type: "info",
          message: "没有权限进行该操作"
        });
        return;
      }
      this.$confirm("此操作将视频添加首页, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.upIndexMethod(row.id, 1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消上传"
          });
        });
    },
    //单条添加首页免费
    handleUpIndexFree(index, row) {
      if (!this.permissions_obj.id_132 && !this.permissions_obj.id_all) {
        this.$message({
          type: "info",
          message: "没有权限进行该操作"
        });
        return;
      }
      this.$confirm("此操作将视频添加首页, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.upIndexMethod(row.id, 2);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消上传"
          });
        });
    },
    //批量上架接口
    async batchUpMethod() {
      let newArr = [];
      this.multipleSelection.forEach((item, index) => {
        newArr.push(item.id);
      });
      let idList = newArr.join(",");
      let parames = {
        handshake: "",
        data: {
          ids: idList
        }
      };
      let res = await this.$axios.post(
        this.$api.videoSet_status_up,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //批量下架接口
    async batchDownMethod() {
      let newArr = [];
      this.multipleSelection.forEach((item, index) => {
        newArr.push(item.id);
      });
      let idList = newArr.join(",");
      let parames = {
        handshake: "",
        data: {
          ids: idList
        }
      };
      let res = await this.$axios.post(
        this.$api.videoSet_status_down,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //批量删除接口
    async batchDeleteMethod() {
      let newArr = [];
      this.multipleSelection.forEach((item, index) => {
        newArr.push(item.id);
      });
      let idList = newArr.join(",");
      let parames = {
        handshake: "",
        data: {
          ids: idList
        }
      };
      let res = await this.$axios.post(
        this.$api.videoDelete_list,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //单条添加首页接口
    async upIndexMethod(id, type) {
      let parames = {
        handshake: "",
        data: {
          ids: id.toString(),
          type: type
        }
      };
      let res = await this.$axios.post(
        this.$api.videoIndexAdds,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getDataList();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    }
  }
};
</script>
<style scoped>
.userVideoUploadManagement {
  padding-bottom: 0.2rem;
}
h3 {
  padding: 0.2rem;
  color: #3c763d;
}
.search {
  display: flex;
  margin-top: 0.2rem;
  padding-left: 0.2rem;
  width: 100%;
  flex-wrap: wrap;
}
.el-input {
  width: 2.5rem;
}
.search label {
  width: 0.83rem;
  height: 0.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f5f7fa;
  color: #909399;
  border: 1px solid #dcdfe6;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  font-size: 14px;
}
.cond {
  display: flex;
  margin-right: 0.4rem;
  margin-bottom: 0.1rem;
}
.search .el-select >>> .el-input__inner {
  border-left: none;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
.search .el-select {
  width: 1.67rem;
}
.opration {
  margin-top: 0.2rem;
  padding-left: 0.2rem;
}
.page {
  margin-top: 0.2rem;
  display: flex;
  justify-content: center;
}
.list {
  margin-top: 0.2rem;
  padding: 0 0.1rem;
  font-size: 0.12rem;
}
.dialogBtn {
  display: flex;
  justify-content: center;
  margin-top: 0.3rem;
}
.row {
  margin-bottom: 0.1rem;
  display: flex;
  align-items: center;
}
.row span {
  width: 1rem;
  display: block;
}
.row >>> .avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.row >>> .avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.row >>> .avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.row >>> .avatar {
  width: 178px;
  height: 178px;
  display: block;
}
.el-checkbox-group {
  width: 90%;
}
.tagList {
  width: 100%;
  padding: 0 0.2rem;
}
.tagList ul {
  display: flex;
  flex-wrap: wrap;
}
.tagList li {
  background: rgb(26, 213, 226);
  padding: 5px 10px;
  margin-right: 0.1rem;
  color: #fff;
  border-radius: 3px;
  cursor: pointer;
  margin-bottom: 0.1rem;
}
.tagList li:hover {
  background: rgb(25, 168, 179);
}
.tagList .active {
  background: rgb(25, 168, 179);
}
.vedioBox {
  display: flex;
  align-items: center;
}
.vedioBox .right {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 0.05rem;
}
.vedioBox .right span {
  color: rgb(19, 141, 150);
}
.el-button {
  margin-bottom: 10px;
}
.dialog .el-input {
  width: 100%;
}
.playList {
  display: flex;
  justify-content: flex-start;
  margin-top: 0.15rem;
}
</style>